<template>
  <!-- 绑定微信客服 -->
  <div class="container">
    <div>
      <!-- api_url(只读) -->
      <div class="flex_y_center">
        <div style="width: 30%; text-align: right">api_url：</div>
        <el-input readonly style="width: 40%" :value="oApiUrl" />
      </div>
      <!-- corp_id -->
      <div class="flex_y_center" style="margin: 15px 0">
        <div style="width: 30%; text-align: right">corp_id：</div>
        <div class="flex_y_center" style="width: 40%">
          <el-input v-model="weixinForm.corp_id" />
          <div style="width: 10px"></div>
          <el-button @click="$message.success('生成成功')">自动生成</el-button>
        </div>
      </div>
      <!-- corp_code(只读) -->
      <div class="flex_y_center">
        <div style="width: 30%; text-align: right">corp_code：</div>
        <el-input v-model="weixinForm.corp_code" style="width: 40%" />
      </div>
    </div>
    <div class="flex_between" style="margin-top: 20px">
      <div></div>
      <el-button type="primary" @click="$emit('send')">保存</el-button>
    </div>
  </div>
</template>

<script>
  export default {
    props: {
      oApiUrl: {
        type: String,
        default: '',
      },
    },
    data() {
      return {
        weixinForm: {
          corp_id: '',
          corp_code: '',
        },
      }
    },
    methods: {},
  }
</script>

<style scoped>
  .flex_between {
    display: flex;
    justify-content: space-between;
  }
</style>
